<template>
	<div>
        <!-- 单选、多选、表格 -->
		<div v-if="props.nowRowData.itemType==1 ||props.nowRowData.itemType==2 ||props.nowRowData.itemType==4">
			<el-button @click="addItem" type="primary" style="margin: 10px">添加</el-button>
			<el-row :gutter="20">
				<el-col :span="4">内容（选项或表头）</el-col>
				<el-col :span="4">分数</el-col>
				<el-col :span="4">排序</el-col>
				<el-col :span="4">特殊字符替换</el-col>
				<el-col :span="8">操作</el-col>
			</el-row>
			<el-row :gutter="20" v-for="(item, index) in list" :key="index" :style="{ marginBottom: '10px', marginLeft: item.parentId ? '20px' : '' }">
				<el-col :span="4"><el-input v-model="item.optionContent"></el-input></el-col>
				<el-col :span="4"><el-input v-model="item.optionScore"></el-input></el-col>
				<el-col :span="4"><el-input v-model="item.sortBy"></el-input></el-col>
				<el-col :span="4">
					<el-select v-model="item.specialFlag">
						<el-option label="是" :value="1"></el-option>
						<el-option label="否" :value="0"></el-option>
					</el-select>
				</el-col>
				<el-col :span="8">
					<el-button v-if="!item.parentId" type="warning" @click="addChildItem(item)">添加子项</el-button>

					<el-button type="danger" @click="toDelItem(item,index)">删除</el-button>
					<el-button type="primary" @click="toAdd(item)">保存</el-button>
				</el-col>
			</el-row>
		</div>
        <!-- 填空 -->
        <div v-if="props.nowRowData.itemType==5 || props.nowRowData.itemType==6" >
            <!-- 填空内容 -->
            <el-form :model="form">
                <el-form-item label="内容">
                    <el-input v-if="props.nowRowData.itemType==5" v-model="form.optionContent"></el-input>
                    <div v-else>
                        <AplidUpload v-model="form.optionContent"></AplidUpload>
                    </div>
                </el-form-item>
            </el-form>
        </div>
        <!-- 图片文件上传 -->
		<div>
			<el-row style="margin-top: 40px">
                <el-col :span="1" :offset="10">
					<el-button @click="toCancel">取消</el-button>
				</el-col>
				<el-col v-if="props.nowRowData.itemType==5 ||props.nowRowData.itemType==6" :span="1" :offset="1">
					<el-button type="primary" @click="toSubmit">保存</el-button>
				</el-col>
				
			</el-row>
		</div>
	</div>
</template>

<script setup lang="ts">
import apiMod from '@/apiMod'
import { ElMessage } from 'element-plus'
import AplidUpload from '@/components/AplidCrud/src/AplidUpload/index.vue'

let emit = defineEmits(['refresh'])
type Props = {
	nowRowData?: any
}
let props = withDefaults(defineProps<Props>(), {
	nowRowData: '',
})

let list = ref([
])
let form = ref({
    id:'',
    optionContent:""
})

// const formRef = ref()

// const onSubmit = (form, done) => {}

// const onSave = () => {
// 	formRef.value!.onSubmit()
// }
// 取消
const toCancel = () =>{
    emit('refresh')
}
// 获取对应数据

const initData = () => {
	let params = {
		itemId: props.nowRowData.id,
        optionType:props.nowRowData.itemType,
		pageParaPO: { size: 100000, current: 1 },
	}
	apiMod.view_bscAssessTableOption_page(params).then((res) => {
		if (props.nowRowData.itemType != 5 && props.nowRowData.itemType != 6) {
			let parentList = res.data.records.filter((el) => {
				return !el.parentId
			})
			let childList = res.data.records.filter((el) => {
				return el.parentId
			})
			childList.forEach((el, ind) => {
				const index = (el1) => el1.id == el.parentId
				let fatherIndex = parentList.findIndex(index)
                if(fatherIndex!=-1){
                    parentList.splice(fatherIndex + 1, 0, el)
                }
			})
			list.value = parentList
		}else{
            if(res.data.records.length>0){
                form.value = res.data.records[0]
            }
            console.log('此时的填空',form.value)
        }
	})
}
initData()
// 添加项
const addItem = () => {
	list.value.push({
		itemId: props.nowRowData.id,
        optionType:props.nowRowData.itemType,
		optionContent: '',
		optionScore: '',
		sortBy: '',
		specialFlag: 0,
	})
}
// 添加子项
const addChildItem = (item) => {
	if (!item.id) {
		ElMessage.error('请先完善父项数据')
		return
	}
	// 拿到父亲数据的位置，在后面插入
	const index = (el) => el.id == item.id
	let fatherIndex = list.value.findIndex(index)
	console.log('父级index', fatherIndex)
	let obj = {
		itemId: props.nowRowData.id,
        optionType:props.nowRowData.itemType,
		parentId: item.id,
		optionContent: '',
		optionScore: '',
		sortBy: '',
		specialFlag: 0,
	}
	list.value.splice(fatherIndex + 1, 0, obj)
	console.log('--------====', list.value)
}
// 确认添加子项(单个保存)
const toAdd = (item) => {
    if(item.id){
        // 编辑
        apiMod.view_bscAssessTableOption_edit(item).then((res) => {
            initData()
            ElMessage.success('操作成功')
        })
    }else{
        // 添加
        apiMod.view_bscAssessTableOption_add(item).then((res) => {
            initData()
            ElMessage.success('操作成功')
        })
    }
	
}
// 填空或者上传文件时
const toSubmit = () => {
    console.log('---=',form.value)
    let params = {
        id:form.value.id==''?undefined:form.value.id,
        itemId: props.nowRowData.id,
        optionType:props.nowRowData.itemType,
		optionContent: form.value.optionContent,
    }
   
    if(params.id){
        // 编辑
        apiMod.view_bscAssessTableOption_edit(params).then((res) => {
            initData()
            emit('refresh')
        })
    }else{
        // 添加
        apiMod.view_bscAssessTableOption_add(params).then((res) => {
            initData()
            emit('refresh')
        })
    }
    
}
// 删除子项
const toDelItem = (item,index) => {
    ElMessageBox.confirm(
    '确认删除当前行?',
    '提示',
    {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(() => {
        apiMod.view_bscAssessTableOption_del([item.id]).then(res=>{
            list.value.splice(index, 1)
            ElMessage({
                type: 'success',
                message: '删除成功',
            })
        })
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: '已取消',
      })
    })
	
}
defineExpose({
	// onSave,
})
</script>

<style scoped></style>
